<template>
  <a-select
    :value="value"
    :mode="multiple ? 'multiple' : undefined"
    style="width: 100%"
    :disabled="disabled"
    placeholder="请选择组织"
    :loading="state.loading"
    :dropdown-match-select-width="false"
    @update:value="(v) => emit('update:value', v)"
  >
    <a-select-option
      v-for="item in state.list"
      :key="item.organizationId"
      :value="item.organizationId"
      :label="item.organizationName"
    >
      <span>{{ item.organizationName }}</span>
      <span style="float: right; margin-left: 16px; color: #999999">{{
        item.organizationCode
      }}</span>
    </a-select-option>
  </a-select>
</template>
<script lang="ts" setup>
import { queryByList } from "@/api/system/organization";
import { useFetchList } from "@/hook/useFetchList";

interface Props {
  /**绑定值 */
  value: string | string[];
  /**多选 */
  multiple?: boolean;
  /**禁用 */
  disabled?: boolean;
  /**组织类型 */
  organizationType: string;
}
const props = defineProps<Props>();
const emit = defineEmits(["update:value"]);
const { state } = useFetchList(queryByList, {
  params: { organizationType: props.organizationType, organizationStatus: "Y" },
});
</script>
